<template>
      <footer>
        <h4>北京找房无忧 > 首页</h4>
        <div class="middle">
          <div class="left">
            <div class="pic"></div>
            <div class="txt">
              <p>iPhone</p>
              <p>客户端</p>
            </div>
          </div>
          <div class="right">
            <div class="pic"></div>
            <div class="txt">
              <p>Android</p>
              <p>客户端</p>
            </div>
          </div>
        </div>
        <p>北京找房无忧房地产经纪有限公司</p>
        <p>网络经营许可证 京ICP备20160812号-12</p>
      </footer>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
@color: #ff8a00;
@color1: #2f3130;
@vw: 3.20vw;
footer {
  // position: fixed;
  // left:0px;
  // bottom: 0px;
  padding: 0px (15/@vw);
  width: 100%;
  height: (155/@vw);
  background-color: @color1;

  h4 {
    font-size: (12/@vw);
    color: rgb(148, 148, 148);
    line-height: (40/@vw);
    border-bottom: 1px solid rgb(148, 148, 148);
  }

  .middle {
    height: (65/@vw);
    display: flex;
    justify-content: space-evenly;
    align-items: center;

    .left,
    .right {
      display: flex;

      .pic {
        margin: (3/@vw) (15/@vw) 0px 0px;
        width: (20/@vw);
        height: (23/@vw);
      }

      .txt {
        font-size: (12/@vw);
        color: rgb(148, 148, 148);
      }
    }

    .left {
      background-image: url(../assets/image/index/apple.png);
      background-size: contain;
      background-repeat: no-repeat;
    }

    .right {
      background-image: url(../assets/image/index/android.png);
      background-size: contain;
      background-repeat: no-repeat;
    }
  }

  >p {
    font-size: (12/@vw);
    text-align: center;
    color: rgb(148, 148, 148);
  }
}
</style>
